<template>
	<div>
        <ITable highlight-row :loading="loading" :columns="columns" :data="data" class="m-t-15" @on-current-change="currentChange"></ITable>
        <Page :total="total" show-sizer show-total show-elevator class="m-t-15" @on-change="changePage" @on-page-size-change="changePageSize"></Page>
    </div>
</template>
<style>
    .m-t-15{margin-top: 15px;}
</style>
<script>
	import Table from 'iview/src/components/table';
    import Page from 'iview/src/components/page';
    
    import Axios from 'admin/config/axios';

	export default{
        props : {
            url :{
                type:String,
            },
            header:{
                type:Array,
            },
            async:{
                type:Boolean,
                default : true,
            },
            currentCallBack:{
                type:Function,
            }
        },
		components:{
            'ITable' : Table,
            Page,
        },
        data () {
            return {
                columns: [],
                data:[],
                loading : true,
                total : 0,
                length : 10,
            }
        },
        methods:{
            tableData(param){
                this.loading = true;
                Axios.Table(this.url,param)
                .then(res =>{
                    if(!res) return false;
                    this.data = res.data.result;
                    this.loading = false;
                    this.total = res.data.total;
                })
            },
            changePage(page){
                this.page = page;
                this.tableData({page:this.page,length:this.length});
            },
            changePageSize(length){
                this.page = 1;
                this.length = length;
                this.tableData({page:this.page,length:this.length});
            },
            init(){
                this.columns = this.header;
                this.tableData({page:this.page,length:this.length});
            },
            currentChange(currentRow,oldCurrentRow){
                this.currentCallBack(currentRow);
            }
        },
        created : function(){
            if(this.async){
                this.init(); 
            }
        }

	}
</script>